<template>
	<view>
		<u-loading-page :loading="load" loading-text="loading..." bg-color="#fff"></u-loading-page>

		<u-sticky bgColor="#fff">
			<u-tabs :list="list4" :current="index" lineWidth="80" :scrollable="false" lineColor="#1296db" :activeStyle="{
		            color: '#1296db'
		        }" :inactiveStyle="{
		            color: '#606266'
		        }" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px; width: 50%" @change="tabsChange">
			</u-tabs>
		</u-sticky>
		<swiper :duration="500" :current="index" :data-index='index' @change="toggle" circular style="height: 100vh">
			<swiper-item>
				<!-- 按顺序对应第一个的内容 -->
				<message :messageList="helpArr"></message>
				<u-empty mode="data" v-if="!load && !helpArr.length" styles="margin-top: 100rpx">
				</u-empty>
			</swiper-item>
			<swiper-item>
				<!-- 按顺序对应第二个的内容 -->
				<message :messageList="newsArr"></message>
				<u-empty mode="data" v-if="!load && !newsArr.length" styles="margin-top: 100rpx">
				</u-empty>
			</swiper-item>
		</swiper>

	</view>
</template>


<script>
	import message from '@/component/message/message.vue'
	export default {
		components: {
			message
		},
		data() {
			return {
				index: 0,
				helpArr: [],
				newsArr: [],
				list4: [{
					name: '帮助中心'
				}, {
					name: '新闻中心'
				}],
				load: false
			}
		},
		onShow() {
			this.getMessage()
			console.log(this.$store.state.loginModules.jwtToken)
		},
		// 离开页面清空数组
		onHide() {
			this.helpArr = []
			this.newsArr = []
		},
		// 判断是否登录
		onTabItemTap(e) {
			if (e.text == '消息') {
				if (!this.$store.state.loginModules.jwtToken) {
					uni.switchTab({
						url: '/pages/my/my'
					})
				}
			}
		},
		methods: {
			async getMessage() {
				if (this.$store.state.loginModules.jwtToken) {
					this.load = true
					// 帮助中心
					const helpResult = await uni.$http.get('/v1/knowledgebase')
					// 新闻中心
					const newsResult = await uni.$http.get('/v1/news')
					this.helpArr = helpResult.data.data.knowledgebase
					this.newsArr = newsResult.data.data.news

					console.log(newsResult.data.data.news);
					console.log(helpResult.data.data.knowledgebase);
					this.load = false
				}
			},
			tabsChange(active) {
				// console.log(active);
				this.index = active.index

			},
			// 切换触发的事件
			toggle(e) {
				this.index = e.detail.current;
			},
		}
	}
</script>

<style>

</style>
